import 'babel-polyfill';
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, IndexRoute, Link } from '$router';
import HomePage from './home';
import AppPage from './app';
import { Scroller, Touchable } from '$yo-component';
import yoHistory from '../common/history';
// import {NavLink} from 'react-router-dom'
const List = require.async('./list');
const Detail = require.async('./detail');
const My = require.async('./my');
const Projrct = require.async('./project');
const Skill = require.async('./skill');
const Work = require.async('./work');
const Root = () => (
    <Router history={yoHistory}>
        <div>
            <Route path="/" component={AppPage}>
                <IndexRoute component={HomePage}/>
                <Route path="skill" getComponent={Skill} />
                <Route path="detail" getComponent={Detail}/>
                <Route path="my" getComponent={My}/>
                <Route path="project" getComponent={Projrct}/>
                <Route path="work" getComponent={Work}/>
            </Route>
        </div>
        
    </Router>
);
  ReactDOM.render(<Root/>, document.getElementById('root'))
